<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

    <f:view contentType="text/html" >
        <link href='http://img79.xooimage.com/files/b/f/d/ttrucoscssshadowbox-35d3f9d.css' rel='stylesheet' type='text/css'/>
        <script src='http://img26.xooimage.com/files/1/1/e/shadowbox-1b8e4a9.js' type='text/javascript'/>
        <script type='text/javascript'>
            Shadowbox.init({
                overlayColor: "#708090",
                overlayOpacity: "0.8",
                player: "html"});
        </script>
        <h:head>
            <f:facet name="first">
                <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
                <title>Social Full Fun</title>
                <link rel="shortcut icon" type="image/x-icon" href="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/icono.ico"/>
            </f:facet>
            <script type="text/javascript">$(document).ready(function(){iniciarDatos();});</script>
            <link href="http://#{initParam['DIRECCION_SERVIDOR']}/estilos/estilo-comun/theme.css" rel="stylesheet" type="text/css"/>
        </h:head>

        <h:body style="background-color: #191947; background-image: url(http://#{initParam['DIRECCION_SERVIDOR']}/estilos/estilo-comunLogin/images/ui-bg_dots-small_25_191947_2x2.png)">
            <ui:include src="sessionTimeOut.xhtml"  />
            <p:layout  fullPage="true">
                <p:ajaxStatus style="width:64px;height:64px;position:fixed;right:5px;bottom:5px">  
                <f:facet name="start">  
                    <p:graphicImage value="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/loading.gif" />  
                </f:facet>  

                <f:facet name="complete">  
                    <h:outputText value="" />  
                </f:facet>  
            </p:ajaxStatus>  
                <p:layoutUnit position="north" size="90">
                    <table>
                        <tr>
                            <td>
                        <h:graphicImage value="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/boton.jpg" height="50" width="50"/>
                        </td>
                        <td style=" position: relative;left: 20px">
                            <!--<p style="font-family: Segoe Script;  ;font-size: 20px; color: #CCCCCC; left: 4px">It`s time to fun</p>-->
                            <h:graphicImage value="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/letras.jpg" height="50" width="200"/>
                        </td>
                        <td>
                        <h:outputLink title="#{comunDataManager.parametros.paValor}" style="float: bottom; position: absolute; right: 0px"
                                                                  onclick="window.open('comentarios.xhtml', 
                                                                      'popupWindowName', 
                                                                      'width=800,height=480, titlebar=no,directories=no, dependent=yes, resizable=no, menubar=no, toolbar=no, fullscreen=no, location=no, top=100, left=300, status=no'); 
                                                                      return false;" value="#">
                                                    <img src="http://#{initParam['DIRECCION_SERVIDOR']}/banners/banner4.gif" style="height: 25px; width: 160px"/>
                                </h:outputLink>
                        </td>
                        </tr>  
                        <tr>
                            <td>
                                <h:outputText value="#{comunDataManager.contador} usuarios registrados" style="font-size: 13px; color: #CCCCCC; float: bottom; position: absolute; left: 0px"/>
                             </td>
                        </tr>
                    </table>
                </p:layoutUnit>

                <p:layoutUnit position="west" size="200">
                    <h:form id="fomularioComunID" binding="#{comunControlador.formulario}" >
                        <center><h:panelGrid columns="1" cellspacing="2">
                                <h:graphicImage value="#{comunDataManager.usuario.usImagen}" width="50" height="55"/>

                            </h:panelGrid></center>
                        <center>
                            <strong>
                                <h:outputLabel  value="#{comunDataManager.usuario.usNombre} #{comunDataManager.usuario.usPrimerApellido}" style="font-family: serif; color: #FF6600"/>
                            </strong>
                        </center>
                        <br/>
                        <center><table>
                                <tr>
                                    <td>
                                        <center><p:commandLink value="Locales" action="#{comunControlador.direccionar('informacionSucursales')}" process="@this"
                                                               ajax="true" style="color: #CCCCCC"/></center> 
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <center><p:commandLink value="Actualización Datos"  action="#{comunControlador.direccionar('actualizarDatos')}"
                                                               process="@this"
                                                               ajax="true" style="color: #CCCCCC"/></center>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <center><p:commandLink value="Generar Tarjeta Virtual"  action="#{comunControlador.direccionar('tarjetaVirtual')}"
                                                               process="@this"
                                                               ajax="true" style="color: #CCCCCC"/></center>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <center><p:commandLink value="Cambio de contrseña"  action="#{comunControlador.direccionar('cambioContrasena')}"
                                                               process="@this"
                                                               ajax="true" style="color: #CCCCCC"/></center>
                                    </td>
                                </tr>
                                <tr>
                                    <td>
                                        <center><p:commandLink value="Salir"  action="#{logOutControlador.logoutCliente()}" 
                                                               process="@this"
                                                               update="@all"
                                                               ajax="true" style="color: #CCCCCC"/></center>
                                    </td>
                                </tr>
                            </table></center>
                        

                        <center>
                            <p:media rendered="#{comunDataManager.mostrarEventoInteres}"
                                     value="#{comunDataManager.eventoInteres.evInVideo}"
                                     width="170" height="170"  player="flash"/>
                        </center>
                        
                        <center>
                            <h:outputText id="tituloEventoInteresID"
                                          rendered="#{comunDataManager.mostrarEventoInteres}"
                                           value="#{comunDataManager.eventoInteres.evInNombre}" 
                                          style="font-family: segoe script; font-size: 15px"/>
                        </center>
                        <h:selectOneRadio id="optionEventoInteresID" layout="pageDirection" 
                                          rendered="#{comunDataManager.mostrarEventoInteres}"
                                          value="#{comunDataManager.resultadoEventoInteres}"
                                          style="font-family: segoe script; font-size: 12px; left: 10px"
                                          required="true"
                                          requiredMessage="Se debe seleccionar una opción">
                            <f:selectItems value="#{comunControlador.selectItemResultadoEventoInteres}"/>
                        </h:selectOneRadio>
                        <center>
                            <p:commandButton value="Enviar" 
                                             rendered="#{comunDataManager.mostrarEventoInteres}"
                                             action="#{comunControlador.enviarResultadoEventoInteres()}"
                                             update="optionEventoInteresID tituloEventoInteresID"
                                             process="@this optionEventoInteresID"
                                             style="size: 10px"/>
                        </center>

                    </h:form>
                </p:layoutUnit>

                <p:layoutUnit id="vista" position="center">
                    <ui:insert name="body">
                         
                    </ui:insert>
                </p:layoutUnit>

                <p:layoutUnit id="publicidad" position="east" size="155" style="max-height: 600px">
                    <ui:repeat value="#{imagenesPublicidad.listaGeneral}" var="imag" >  
                        <p:imageSwitch effect="shuffle">  
                            <ui:repeat value="#{imag}" var="imagenes">  
                                <center><p:graphicImage value="http://#{initParam['DIRECCION_SERVIDOR']}/Publicidad/#{imagenes}" 
                                                        width="120" height="115" style=" position: relative; top: 25px; bottom: 25px; left: 8px"/></center>  
                            </ui:repeat>  
                        </p:imageSwitch>
                    </ui:repeat> 
                    <br/> <br/>      
                    <center><img style=" height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/s.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/i.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/g.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/u.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/e.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/n.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/o.gif"/>
                    <img style="height: 10px; width: 10px" src="http://#{initParam['DIRECCION_SERVIDOR']}/gifs/gif5/s.gif"/></center>

                    <center><table cellspacing="0">
                                    <tr>
                                        <td>
                                            <center><h:outputLink title="#{comunDataManager.redesSocialesUno.rsNombre}" style="float: bottom;"
                                                                  onclick="window.open('#{comunDataManager.redesSocialesUno.rsLink}', 
                                                                      'popupWindowName', 
                                                                      'titlebar=no,directories=no, dependent=yes, resizable=no, menubar=no, toolbar=no, fullscreen=yes, location=no, top=200, left=400, status=no'); 
                                                                      return false;" value="#">
                                                    <img src="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/facebook3.jpg" style="height: 30px; width: 30px"/>
                                                </h:outputLink></center>
                                        </td>
                                        <td>
                                            <center><h:outputLink title="#{comunDataManager.redesSocialesDos.rsNombre}" style="float: bottom" 
                                                                  onclick="window.open('#{comunDataManager.redesSocialesDos.rsLink}', 
                                                                      'popupWindowName',
                                                                      'titlebar=no,directories=no, dependent=yes, resizable=no, menubar=no, toolbar=no, fullscreen=yes, location=no, top=200, left=400, status=no'); 
                                                                      return false;" value="#">
                                                    <img src="http://#{initParam['DIRECCION_SERVIDOR']}/Iconos/twitter2.jpg" style="height: 30px; width: 30px"/>
                                                    </h:outputLink></center>
                                    
                                        </td>
                                    </tr>
                            </table></center>
                </p:layoutUnit>

            </p:layout>

        </h:body>

    </f:view>
</html>
